import { CanvasKeyBoardEvent, CanvasMouseEvent } from "../ch3/Event";
import { Math2D } from "../ch3/Math2d";
import { TestCh5 } from "./TestApp";

class Tank {

    width = 80;
    height = 50;

    x = 100;
    y = 100

    scaleX = 1.0;
    scaleY = 1.0;

    //底座角度
    tankRotation = 0;
    //炮塔角度
    turretRotation = 0;

    initYAxis = true;
    showLine = true;
    showCoord = false;
    gunLength = Math.max(
        this.width,
        this.height
    )
    gunMuzzleRadius = 5; 
    
    targetX = 0;
    targetY = 0;

    linearSpeed = 100;
    turretRotateSpeed = Math2D.toRadian(2)


    draw(app:TestCh5){
        if(app.context2D != null){
            app.context2D.save();

            app.context2D.translate(
                this.x,this.y
            )
            app.context2D.rotate(
                this.tankRotation
            )
            app.context2D.scale(
                this.scaleX,
                this.scaleY
            )
            
            /* 底座 */
            app.context2D.save();
                app.context2D.fillStyle="grey";
                app.context2D.beginPath();
                app.context2D.rect(
                    -this.width*0.5,
                    -this.height*0.5,
                    this.width,
                    this.height
                )
                app.context2D.fill();
            app.context2D.restore();
            
            // 炮塔
            app.context2D.save();
                app.context2D.rotate(
                    this.turretRotation
                )    
                app.context2D.fillStyle="red";
                app.context2D.beginPath();
                app.context2D.ellipse(
                    0,0,15,10,
                    0,0,Math.PI*2
                )
                app.context2D.fill();
            
                //炮管
                app.context2D.strokeStyle ="blue";
                app.context2D.lineWidth = 5
                app.context2D.lineCap = "round";
                app.context2D.beginPath();
                app.context2D.moveTo(0,0);
                app.context2D.lineTo(this.gunLength,0);
                app.context2D.stroke()

                // 炮管头部
                app.context2D.translate(
                    this.gunLength,0
                )
                app.context2D.translate(
                    this.gunMuzzleRadius,0
                )
                app.fillCircle(
                    0,0,5,"black"
                )

            app.context2D.restore()

            // 
            app.context2D.save();
            app.context2D.translate(this.width*0.5,0)
            app.fillCircle(
                0,0,5,"green"
            )
            app.context2D.restore();

            if(this.showCoord){
                app.context2D.save();
                    app.context2D.lineWidth = 1;
                    app.context2D.lineCap = "butt";
                    app.strokeCoord(
                        0,0,
                        this.width*1.2,
                        this.height*1.2
                    )
                app.context2D.restore();
            }
            app.context2D.restore();
            // 绘制连线
            if(this.showLine){
                app.context2D.save();
                    app.strokeLine(
                        this.x,this.y,
                        app.canvas.width*0.5,
                        app.canvas.height*0.5
                    )
                    app.strokeLine(
                        this.x,this.y,
                        this.targetX,this.targetY
                    )
                app.context2D.restore()
            }


        }
    }
    onKeyPress(evt:CanvasKeyBoardEvent){
        if(evt.key == "r"){
            this.turretRotation += this.turretRotateSpeed
        }else if(evt.key == "e"){
            this.turretRotation -= this.turretRotateSpeed
        }else if(evt.key == "t"){
            this.turretRotation = 0 
        }
    }
    onMouseMove(evt:CanvasMouseEvent){
        this.targetX = evt.canvasPosition.x;
        this.targetY = evt.canvasPosition.y
        this._lookAt();
    }
    _moveTowardTo(intervalSec:number){
        //计算坦克是否到达书店
        let diffX = this.targetX - this.x
        let diffY = this.targetY - this.y;

        let dis = diffX*diffX + diffY*diffY

        let currSpeed = this.linearSpeed*intervalSec;

        console.log("dis",dis,currSpeed);
        //计算距离
        if(dis > currSpeed * currSpeed){
            this.x = this.x +
                Math.cos(this.tankRotation)*currSpeed;
            this.y = this.y +
                Math.sin(this.tankRotation)*currSpeed
        }
    }

    _lookAt(){
        let diffX = this.targetX - this.x
        let diffY = this.targetY - this.y;

        let radian = Math.atan2(diffY,diffX);
        this.tankRotation = radian;
    }
}

export {
    Tank
}